<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html">

    <body>
        <ui:composition>
            <div class="navbar navbar-inverse navbar-fixed-top">
                <div class="navbar-inner">
                    <div class="container">
                        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </a>
                        <a class="blue-shadow" href="#">Portal Cognitive</a>
                        <div class="nav-collapse collapse">
                            <ul class="nav">
                                <li class="active"><a href="#">Home</a></li>
                                <li><a href="#about">MMORPG</a></li>
                                <li><a href="#contact">Aventura</a></li>
                                <li><a href="#contact">Comunidade</a></li>
                            </ul>
                            <h:form id="form-login" class="navbar-search">  
                                <input type="text" class="search-query" placeholder="Pesquisar no portal..."/>  
                            </h:form>  
                            <ul class="nav navbar-form pull-right">
                                <li class="dropdown">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Entrar <b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li class="nav-header">Login</li>
                                        <li class="divider"></li>
                                        <li>
                                            <div id="login-form">

                                                <h:form class="login">
                                                    <h:inputText class="mail validate[required,custom[email]] text-input" id="email" value="#{sessionBean.user.email}" />
                                                    <h:inputSecret class="pass validate[required] text-input" id="password" value="#{sessionBean.user.password}"/>
                                                    <span id="check-lembrar"><input type="checkbox" id="lembrar"/><span>lembrar</span></span>
                                                    <h:commandButton class="btn" value="Entrar" action="#{sessionBean.log()}"/>
                                                </h:form>

                                            </div>
                                        </li>
                                        <li class="divider"></li>
                                        <li><a data-toggle="modal" href="#responsive">Registre-se!</a></li>
                                    </ul>
                                </li>
                            </ul>

                        </div><!--/.nav-collapse -->
                    </div>
                </div>
            </div>

            <div id="responsive" class="modal hide fade" tabindex="-1" data-width="760">
                <h:form class="login">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color: white">Ã—</button>
                        <h3>Registre-se agora, Ã© muito simples!</h3>

                    </div>
                    <div class="modal-body">
                        <div class="row-fluid">
                            <div class="span6">
                                <h4>Seu email</h4>
                                <p><h:inputText id="email-register" class="span12 validate[required,custom[email]] text-input" value="#{registrationBean.user.email}" onfocus="" onblur="fillOnBlur('Insira seu email', this);"/></p>
                                <h4>Senha bem segura <a>(?)</a></h4>
                                <p><h:inputSecret id="pass-register" class="span12 validate[required,maxSize[10]]" value="#{registrationBean.password}" /></p>
                                <h4>PaÃ­s de origem</h4>
                               
                            </div>
                            <div class="span6">
                                <h4>Email novamente</h4>
                                <p><h:inputText id="mail-registe32" class="span12" value="#{registrationBean.emailConfirm}" onfocus="" onblur="fillOnBlur('Insira seu email', this);"/></p>
                                <h4>Senha novamente</h4>
                                <p><h:inputSecret id="pass-register2" class="span12" value="#{registrationBean.passwordConfirm}" /></p>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" data-dismiss="modal" class="btn">NÃ£o, agora nÃ£o</button>
                        <h:commandButton class="btn btn-primary" value="Cadastrar-me!" action="#{registrationBean.signup()}" onclick="$('#ajx-loader').show();"/>
                        <img id="ajx-loader" src="resources/images/ajax-loader.gif" alt="" style="padding-left: 7px; display: none; float: right"/>
                    </div>
                </h:form>
            </div>
        </ui:composition>
    </body>
</html>
